<template>

    <div class="col-xs-12 view-container">
        <el-row :gutter="20">
            <el-col :span="24">
                <el-col :span="14">
                    <el-card v-if="radioValue==0">
                        <div slot="header">配置内容</div>
                        <el-form :inline="true"  label-width="110px">

                            <el-form-item   label="纸张宽度">
                                    <el-input v-model="ticketSale.tickBasic.paperwidth" >
                                        <template slot="append">mm</template>
                                    </el-input>
                            </el-form-item>
                            <el-form-item   label="上边距">
                                <el-input v-model="ticketSale.tickBasic.topmargin" >
                                    <template slot="append">mm</template>
                                </el-input>
                            </el-form-item>
                            <el-form-item  label="下边距">
                                <el-input v-model="ticketSale.tickBasic.bottommargin" >
                                    <template slot="append">mm</template>
                                </el-input>
                            </el-form-item>
                            <el-form-item  label="左边距">
                                <el-input v-model="ticketSale.tickBasic.leftmargin" >
                                    <template slot="append">mm</template>
                                </el-input>
                            </el-form-item>
                            <el-form-item  label="右边距">
                                <el-input v-model="ticketSale.tickBasic.rightmargin" >
                                    <template slot="append">mm</template>
                                </el-input>
                            </el-form-item>
                            <el-form-item  label="行距">
                                <el-select placeholder="行距" v-model="ticketSale.tickBasic.rowspace">
                                    <el-option v-for="(item) in lineOptions" :key="item.value" :label="item.label" :value="item.value"></el-option>
                                </el-select>
                            </el-form-item>
                            <el-form-item  :span="12" label="普通分割行">
                                <el-input v-model="ticketSale.tickBasic.lineformat" ></el-input>
                            </el-form-item>
                            <el-form-item  label="补打小票分割行">
                                <el-input v-model="ticketSale.tickBasic.lineformat_again" ></el-input>
                            </el-form-item>
                            <el-form-item  label="日期格式">
                                <el-select placeholder="日期格式" v-model="ticketSale.tickBasic.dateformat">
                                    <el-option label="yyyy.MM.dd" value="yyyy.MM.dd"></el-option>
                                    <el-option label="yyyy/MM/dd" value="yyyy/MM/dd"></el-option>
                                    <el-option label="yyyy年MM月dd日" value="yyyy年MM月dd日"></el-option>
                                </el-select>
                            </el-form-item>
                            <el-form-item  label="时间格式">
                                <el-select placeholder="时间格式" v-model="ticketSale.tickBasic.timeformat">
                                    <el-option label="HH:mm:ss" value="HH:mm:ss"></el-option>
                                    <el-option label="AM HH:mm:ss" value="AM HH:mm:ss"></el-option>
                                    <el-option label="上午 HH:mm:ss" value="上午 HH:mm:ss"></el-option>
                                </el-select>
                            </el-form-item>
                            <el-form-item  label="网址">
                                <el-input v-model="ticketSale.tickBasic.website" ></el-input>
                            </el-form-item>
                            <el-form-item  label="服务热线">
                                <el-input v-model="ticketSale.tickBasic.hotline" ></el-input>
                            </el-form-item>
                            <el-form-item  label="对齐方式">
                                <el-select placeholder="对齐方式" v-model="ticketSale.tickBasic.alignment">
                                    <el-option label="左对齐" :value="0"></el-option>
                                    <el-option label="右对齐" :value="1"></el-option>
                                    <el-option label="居中对齐" :value="2"></el-option>
                                </el-select>
                            </el-form-item>
                            <el-form-item  label="切纸方式">
                                <el-select placeholder="切纸方式" v-model="ticketSale.tickBasic.cutway">
                                    <el-option label="打印后切纸" :value="0"></el-option>
                                </el-select>
                            </el-form-item>
                            <h5>配置项显示顺序</h5>
                            <div style="margin-top: 15px;">
                                <el-form-item v-for="(item,key) in tickInitInfo"  >
                                    <el-input style="width:50px; text-align:center" v-model="ticketSale.tickConditionIndexOut[item.name]" > 
                                    </el-input> {{ item.label }}
                                </el-form-item>
                                <!-- <el-form-item >
                                    <el-input style="width:50px; text-align:center" v-model="ticketSale.tickConditionIndexOut.ticketHead" > 
                                    </el-input> 小票头
                                </el-form-item>
                                <el-form-item >
                                    <el-input style="width:50px; text-align:center" v-model="ticketSale.tickConditionIndexOut.ticketFoot" > 
                                    </el-input> 小票尾
                                </el-form-item>
                                <el-form-item >
                                    <el-input style="width:50px; text-align:center" v-model="ticketSale.tickConditionIndexOut.ticketGoods" > 
                                    </el-input> 商品信息
                                </el-form-item>
                                <el-form-item >
                                    <el-input style="width:50px; text-align:center" v-model="ticketSale.tickConditionIndexOut.ticketMoney" > 
                                    </el-input> 金额信息
                                </el-form-item>
                                <el-form-item >
                                    <el-input style="width:50px; text-align:center" v-model="ticketSale.tickConditionIndexOut.ticketMemberInfo" > 
                                    </el-input> 会员信息
                                </el-form-item>
                                <el-form-item >
                                    <el-input style="width:50px; text-align:center" v-model="ticketSale.tickConditionIndexOut.ticketBankCard" > 
                                    </el-input> 银行卡信息
                                </el-form-item>
                                <el-form-item >
                                    <el-input style="width:50px; text-align:center" v-model="ticketSale.tickConditionIndexOut.ticketCouponSend" > 
                                    </el-input> 优惠券发放信息
                                </el-form-item>
                                <el-form-item >
                                    <el-input style="width:50px; text-align:center" v-model="ticketSale.tickConditionIndexOut.ticketCouponUse" > 
                                    </el-input> 优惠券使用信息
                                </el-form-item>
                                <el-form-item >
                                    <el-input style="width:50px; text-align:center" v-model="ticketSale.tickConditionIndexOut.ticketCouponList" > 
                                    </el-input> 优惠券拥有信息
                                </el-form-item> -->
                                <!-- <el-form-item >
                                    <el-input style="width:50px; text-align:center" v-model="ticketSale.tickConditionIndexOut.ticketDailyContent" > 
                                    </el-input> 停车券信息
                                </el-form-item> -->
                                 
                                <!-- <el-form-item  v-for="item in tContainer.config.sort" :key="item.value"  >
                                    <el-input style="width:50px; text-align:center" v-model="item.value" > 
                                    </el-input>{{ item.label }}
                                </el-form-item> -->
                                 
                            </div>
                        </el-form>
                    </el-card>
                    <el-card v-if="!!radioValue" data-title="小票头">
                        <div slot="header">配置内容</div>
                        <el-form :inline="true"  label-width="80px">
                            <h5>可用标签</h5>
                            <div class="labels-tag">
                                <el-tag 
                                    style="min-width:100px; text-align:center"
                                    @click.native="labelFn(item)" 
                                    v-for="item in tickInitInfo[tagFlag].tagList" 
                                    :key="item">{{item}}</el-tag>
                                <!-- v-for="item in tContainer[radioValue].labels" :key="item">{{item}}</el-tag> -->
                            </div>
                            
                            <h5 style="margin-top:15px;">编辑内容</h5>
                            <!-- <div style="margin-top: 15px;">
                                <el-input type="textarea" ref="labelContent" 
                                :autosize="{ minRows: 12, maxRows: 14}" 
                                @focus="focusFn()" 
                                v-model="tContainer[radioValue].value"></el-input>
                            </div> --> 
                            <div style="margin-top: 15px;">
                                <el-input type="textarea" ref="labelContent" 
                                :autosize="{ minRows: 12, maxRows: 14}" 
                                @focus="focusFn()" 
                                v-model="ticketSale.tickConditionOut[tickInitInfo[tagFlag].name]"></el-input>
                            </div>
                        </el-form>
                    </el-card>
                     
                </el-col>
                <el-col :span="10">
                    <el-card>
                        <div slot="header">内容预览</div>
                        <div class="ticket-view" style="width:260px;font-size:12px;padding:50px 10px;border:1px dashed #333 " v-html="previewContent" id="ticketView">
                            
                            <!-- <p>-----------------------------------------</p>
                            <p>2015.09.08</p>
                            <p>16:40:40</p>
                            <p>www.bbkmall.com</p>
                            <p>4000-856-857</p>
                            <p></p> -->
                        </div>
                    </el-card>
                </el-col>
            </el-col>
        </el-row>
        
    </div>


</template>

<script> 
    export default {
        data() {
            return {
                ticketObj: {},
                lastInput:'',
                form:{
                    lineHeight:'',
                    labelContent:''
                },
                previewObj:{
                    "店铺代码":'13500224',
                    "店铺名称":'老孙烧饼店',
                    "订单号":'201805231122',
                    "收款台号":'001',
                    "收款员代码":'10001',
                    "收款员姓名":'大圣',
                    "销售员代码":'20001',
                    "销售员姓名":'猴哥',
                    "交易日期":'2018-5-23',
                    "交易时间":'18:00:00',
                    "网址":'http://www.laosun.com',
                    "服务热线":'010-88888888',
                    "分割行":'<br>------------------------<br>',
                    "换行":'<br>',
                    "门店名称":'老孙烧饼首尔店',
                    "商品代码":'2584221',
                    "商品名称":'老孙烧饼',
                    "数量":'99',
                    "金额":'99.00',
                    "消耗积分":'9900',
                    "新增积分":'99',
                    "商品明细开始":'<br>商品明细开始<br>',
                    "商品明细结束":'<br>商品明细结束<br>',
                    "总数量":'199',
                    "总金额":'199',
                    "总消耗积分":'19900',
                    "总新增积分":'199',
                    "代金券名称":'100代金券',
                    "代金券金额":'100',
                    "积分抵扣名称":'100积分抵扣1元',
                    "积分抵扣金额":'1',
                    "应付金额":'199.00',
                    "实付金额":'9.00',
                    "收款方式名称":'收款方式名称',
                    "收款方式金额":'10.00',
                    "找零金额":'1.00',
                    "代金券明细开始":'<br>代金券明细开始<br>',
                    "代金券明细结束":'<br>代金券明细结束<br>',
                    "收款方式明细开始":'<br>收款方式明细开始<br>',
                    "收款方式明细结束":'<br>收款方式明细结束<br>',
                    "折扣名称":'折扣名称',
                    "折扣金额":'9.00',
                    "会员卡号":'20181232115',
                    "会员姓名":'老孙',
                    "会员手机号码":'18122334455',
                    "会员卡类型":'铂金卡',
                    "累计积分":'99999999',
                    "银行卡号":'6225 **** 2115',
                    "银行名称":'招商银行',
                    "消费金额":'199.00',
                    "签购单号":'654123135',
                    "优惠券名称":'优惠券名称',
                    "优惠券金额":'100.00',
                    "结束日期":'2020-12-12',
                    "优惠券明细开始":'<br>优惠券明细开始<br>',
                    "优惠券明细结束":'<br>优惠券明细结束<br>',
                    "优惠券余额":'10001.00'

                },
                lineOptions: [
                    {
                    value: 0,
                    label: '单倍行距'
                    }, {
                    value: 1,
                    label: '1.5倍行距'
                    }, {
                    value: 2,
                    label: '双倍行距'
                    }
                ],
                tickInitInfo:{//排序，和配置项菜单顺序一致
                    101:{
                        name:'ticketHead',
                        label:'小票头',
                        tagList:['店铺代码','店铺名称','订单号','收款台号','收款员代码','收款员姓名','销售员代码','销售员姓名','交易日期','交易时间','网址','服务热线','分割行','换行'],                    },
                    102:{
                        name:'ticketFoot',
                        label:'小票尾',
                        tagList:['店铺代码','店铺名称','订单号','收款台号','收款员代码','收款员姓名','销售员代码','销售员','姓名','交易日期','交易时间','网址','服务热线','分割行','换行']
                    },
                    103:{
                        name:'ticketGoods',
                        label:'商品信息',
                        tagList:['商品代码','商品名称','数量','金额','消耗积分','新增积分','商品明细开始','商品明细结束','分割行','换行']
                    },
                    104:{
                        name:'ticketMoney',
                        label:'金额信息',
                        tagList:['总数量','总金额','总消耗积分','总新增积分','代金券名称','代金券金额','积分抵扣名称','积分抵扣金额','应付金额','实付金额','收款方式名称','收款方式','金额','找零金额','代金券明细开始','代金券明细结束','收款方式明细开始','收款方式明细结束','分割行','换行']
                    },
                    105:{
                        name:'ticketMemberInfo',
                        label:'会员信息',  
                        tagList:['会员卡号','会员姓名','会员手机号码','会员卡类型','新增积分','消耗积分','累计积分','分割行','换行']
                    },
                    106:{
                        name:'ticketBankCard',
                        label:'银行卡信息',
                        tagList:[
                            '银行卡号',
                            '银行名称',
                            '消费金额',
                            '签购单号',
                            '分割行',
                            '换行',
                        ]
                    },
                    107:{
                        name:'ticketCouponSend',
                        label:'优惠券发放信息',
                        tagList:[
                            '优惠券名称',
                            '优惠券金额',
                            '结束日期',
                            '优惠券明细开始',
                            '优惠券明细结束',
                            '分割行',
                            '换行',
                        ]
                    },
                    108:{
                        name:'ticketCouponUse',
                        label:'优惠券使用信息',
                        tagList:[
                            '优惠券名称',
                            '优惠券金额',
                            '优惠券明细开始',
                            '优惠券明细结束',
                            '分割行',
                            '换行',
                        ]
                    },
                    109:{
                        name:'ticketCouponList',
                        label:'优惠券拥有信息',
                        tagList:[
                            '优惠券名称',
                            '优惠券余额',
                            '结束日期',
                            '优惠券明细开始',
                            '优惠券明细结束',
                            '分割行',
                            '换行',
                        ]
                    },
                    // 销售补打小票
                    201:{ 
                        name:'ticketHead',
                        label:'小票头',
                        tagList:[
                            '店铺代码',
                            '店铺名称',
                            '订单号',
                            '收款台号',
                            '收款员代码',
                            '收款员姓名',
                            '销售员代码',
                            '销售员姓名',
                            '交易日期',
                            '交易时间',
                            '网址',
                            '服务热线',
                            '补打人代码',
                            '补打人姓名',
                            '补打日期',
                            '补打时间',
                            '普通分割行',
                            '换行',
                            '补打小票分割行',
                        ]
                    },
                    202:{
                        name:'ticketFoot',
                        label:'小票尾',
                        tagList:[
                            '店铺代码',
                            '店铺名称',
                            '门店名称',
                            '订单号',
                            '收款台号',
                            '收款员代码',
                            '收款员姓名',
                            '销售员代码',
                            '销售员姓名',
                            '交易日期',
                            '交易时间',
                            '网址',
                            '服务热线',
                            '补打人代码',
                            '补打人姓名',
                            '补打日期',
                            '补打时间',
                            '普通分割行',
                            '换行',
                            '补打小票分割行',
                        ]
                    },
                    203:{
                        name:'ticketGoods',
                        label:'商品信息',
                        tagList:[
                            '商品代码',
                            '商品名称',
                            '数量',
                            '金额',
                            '消耗积分',
                            '新增积分',
                            '普通分割行',
                            '商品明细开始',
                            '商品明细结束',
                            '换行',
                            '补打小票分割行',
                        ]
                    },
                    204:{
                        name:'ticketMoney',
                        label:'金额信息',
                        tagList:[
                            '总数量',
                            '总金额',
                            '总消耗积分',
                            '总新增积分',
                            '代金券名称',
                            '代金券金额',
                            '积分抵扣名称',
                            '积分抵扣金额',
                            '应付金额',
                            '实付金额',
                            '收款方式名称',
                            '收款方式金额',
                            '找零金额',
                            '普通分割行',
                            '代金券明细开始',
                            '代金券明细结束',
                            '收款方式明细开始',
                            '收款方式明细结束',
                            '换行',
                            '补打小票分割行',
                            '折扣名称',
                            '折扣金额',
                        ]
                    },
                    205:{
                        name:'ticketMemberInfo',
                        label:'会员信息',  
                        tagList:[
                            '会员卡号',
                            '会员姓名',
                            '会员手机号码',
                            '会员卡类型',
                            '新增积分',
                            '消耗积分',
                            '累计积分',
                            '普通分割行',
                            '换行',
                            '补打小票分割行',
                        ]
                    },
                    206:{
                        name:'ticketBankCard',
                        label:'银行卡信息',
                        tagList:[
                            '银行卡号',
                            '银行名称',
                            '消费金额',
                            '签购单号',
                            '普通分割行',
                            '换行',
                            '补打小票分割行',
                        ]
                    },
                    207:{
                        name:'ticketCouponSend',
                        label:'优惠券发放信息',
                        tagList:[
                            '优惠券名称',
                            '优惠券金额',
                            '结束日期',
                            '普通分割行',
                            '优惠券明细开始',
                            '优惠券明细结束',
                            '换行',
                            '补打小票分割行',
                        ]
                    },
                    208:{
                        name:'ticketCouponUse',
                        label:'优惠券使用信息',
                        tagList:[
                            '优惠券名称',
                            '优惠券金额',
                            '普通分割行',
                            '优惠券明细开始',
                            '优惠券明细结束',
                            '换行',
                            '补打小票分割行',
                            
                        ]
                    },
                    209:{
                        name:'ticketCouponList',
                        label:'优惠券拥有信息',
                        tagList:[
                            '优惠券名称',
                            '优惠券余额',
                            '结束日期',
                            '普通分割行',
                            '优惠券明细开始',
                            '优惠券明细结束',
                            '换行',
                            '补打小票分割行',
                        ]
                    },
                    // 退货小票
                    301:{ 
                        name:'ticketHead',
                        label:'小票头',
                        tagList:[
                            '店铺代码',
                            '店铺名称',
                            '订单号',
                            '收款台号',
                            '收款员代码',
                            '收款员姓名',
                            '销售员代码',
                            '销售员姓名',
                            '交易日期',
                            '交易时间',
                            '网址',
                            '服务热线',
                            '退货原因',
                            '分割行',
                            '换行',
                        ]
                    },
                    302:{
                        name:'ticketFoot',
                        label:'小票尾',
                        tagList:[
                            '店铺代码',
                            '店铺名称',
                            '门店名称',
                            '订单号',
                            '收款台号',
                            '收款员代码',
                            '收款员姓名',
                            '销售员代码',
                            '销售员姓名',
                            '交易日期',
                            '交易时间',
                            '网址',
                            '服务热线',
                            '退货原因',
                            '分割行',
                            '换行',
                        ]
                    },
                    303:{
                        name:'ticketGoods',
                        label:'商品信息',
                        tagList:[
                            '商品代码',
                            '商品名称',
                            '数量',
                            '金额',
                            '退货积分',
                            '商品明细开始',
                            '商品明细结束',
                            '分割行',
                            '换行',
                        ]
                    },
                    304:{
                        name:'ticketMoney',
                        label:'金额信息',
                        tagList:[
                            '总数量',
                            '总金额',
                            '总退货积分',
                            '代金券名称',
                            '代金券金额',
                            '积分抵扣名称',
                            '积分抵扣金额',
                            '应退金额',
                            '实退金额',
                            '退款方式名称',
                            '退款方式金额',
                            '找零金额',
                            '代金券明细开始',
                            '代金券明细结束',
                            '退款方式明细开始',
                            '退款方式明细结束',
                            '分割行',
                            '换行',
                            '折扣名称',
                            '折扣金额',
                        ]
                    },
                    305:{
                        name:'ticketMemberInfo',
                        label:'会员信息',  
                        tagList:[
                            '会员卡号',
                            '会员姓名',
                            '会员手机号码',
                            '会员卡类型',
                            '退货积分',
                            '退回积分',
                            '累计积分',
                            '分割行',
                            '换行',
                        ]
                    },
                    306:{
                        name:'ticketBankCard',
                        label:'银行卡信息',
                        tagList:[
                            '银行卡号',
                            '银行名称',
                            '退款金额',
                            '签购单号',
                            '分割行',
                            '换行', 
                        ]
                    },
                    307:{
                        name:'ticketCouponSend',
                        label:'优惠券退回信息',
                        tagList:[
                            '优惠券名称',
                            '优惠券金额',
                            '结束日期',
                            '优惠券明细开始',
                            '优惠券明细结束',
                            '分割行',
                            '换行',
                        ]
                    },
                    308:{
                        name:'ticketCouponUse',
                        label:'优惠券回收信息',
                        tagList:[
                            '优惠券名称',
                            '优惠券金额',
                            '优惠券明细开始',
                            '优惠券明细结束',
                            '分割行',
                            '换行',
                        ]
                    },
                    309:{
                        name:'ticketCouponList',
                        label:'优惠券拥有信息',
                        tagList:[
                            '优惠券名称',
                            '优惠券余额',
                            '优惠券明细开始',
                            '优惠券明细结束',
                            '结束日期',
                            '分割行',
                            '换行',
                        ]
                    },
                    // 退货补打小票
                    401:{ 
                        name:'ticketHead',
                        label:'小票头',
                        tagList:[
                            '店铺代码',
                            '店铺名称',
                            '订单号',
                            '收款台号',
                            '收款员代码',
                            '收款员姓名',
                            '销售员代码',
                            '销售员姓名',
                            '交易日期',
                            '交易时间',
                            '网址',
                            '服务热线',
                            '退货原因',
                            '补打人代码',
                            '补打人姓名',
                            '补打日期',
                            '补打时间',
                            '普通分割行',
                            '换行',
                            '补打小票分割行',
                        ]
                    },
                    402:{
                        name:'ticketFoot',
                        label:'小票尾',
                        tagList:[
                            '店铺代码',
                            '店铺名称',
                            '门店名称',
                            '订单号',
                            '收款台号',
                            '收款员代码',
                            '收款员姓名',
                            '销售员代码',
                            '销售员姓名',
                            '交易日期',
                            '交易时间',
                            '网址',
                            '服务热线',
                            '退货原因',
                            '补打人代码',
                            '补打人姓名',
                            '补打日期',
                            '补打时间',
                            '普通分割行',
                            '换行',
                            '补打小票分割行',
                        ]
                    },
                    403:{
                        name:'ticketGoods',
                        label:'商品信息',
                        tagList:[
                            '商品代码',
                            '商品名称',
                            '数量',
                            '金额',
                            '退货积分',
                            '普通分割行',
                            '商品明细开始',
                            '商品明细结束',
                            '换行',
                            '补打小票分割行',
                        ]
                    },
                    404:{
                        name:'ticketMoney',
                        label:'金额信息',
                        tagList:[
                            '总数量',
                            '总金额',
                            '总退货积分',
                            '代金券名称',
                            '代金券金额',
                            '积分抵扣名称',
                            '积分抵扣金额',
                            '应退金额',
                            '实退金额',
                            '退款方式名称',
                            '退款方式金额',
                            '找零金额',
                            '普通分割行',
                            '代金券明细开始',
                            '代金券明细结束',
                            '退款方式明细开始',
                            '退款方式明细结束',
                            '换行',
                            '补打小票分割行',
                            '折扣名称',
                            '折扣金额',
                        ]
                    },
                    405:{
                        name:'ticketMemberInfo',
                        label:'会员信息',  
                        tagList:[
                            '会员卡号',
                            '会员姓名',
                            '会员手机号码',
                            '会员卡类型',
                            '退货积分',
                            '退回积分',
                            '累计积分',
                            '普通分割行',
                            '换行',
                            '补打小票分割行',
                        ]
                    },
                    406:{
                        name:'ticketBankCard',
                        label:'银行卡信息',
                        tagList:[
                            '银行卡号',
                            '银行名称',
                            '退款金额',
                            '签购单号',
                            '普通分割行',
                            '换行',
                            '补打小票分割行',
                        ]
                    },
                    407:{
                        name:'ticketCouponSend',
                        label:'优惠券退回信息',
                        tagList:[
                            '优惠券名称',
                            '优惠券金额',
                            '结束日期',
                            '普通分割行',
                            '优惠券明细开始',
                            '优惠券明细结束',
                            '换行',
                            '补打小票分割行',
                        ]
                    },
                    408:{
                        name:'ticketCouponUse',
                        label:'优惠券回收信息',
                        tagList:[
                            '优惠券名称',
                            '优惠券金额',
                            '普通分割行',
                            '优惠券明细开始',
                            '优惠券明细结束',
                            '换行',
                            '补打小票分割行',
                        ]
                    },
                    409:{
                        name:'ticketCouponList',
                        label:'优惠券拥有信息',
                        tagList:[
                            '优惠券名称',
                            '优惠券余额',
                            '结束日期',
                            '普通分割行',
                            '优惠券明细开始',
                            '优惠券明细结束',
                            '换行',
                            '补打小票分割行',
                        ]
                    },
                    // 班报
                    501:{ 
                        name:'ticketHead',
                        label:'班报头',
                        tagList:[
                            '收款台号',
                            '收款员代码',
                            '收款员姓名',
                            '店铺代码',
                            '店铺名称',
                            '打印日期',
                            '打印时间',
                            '分割行',
                            '换行',
                        ]
                    },
                    502:{
                        name:'ticketFoot',
                        label:'班报尾',
                        tagList:[
                            '收款台号',
                            '收款员代码',
                            '收款员姓名',
                            '店铺代码',
                            '店铺名称',
                            '打印日期',
                            '打印时间',
                            '分割行',
                            '换行',
                        ]
                    },
                    503:{
                        name:'ticketDailyContent',
                        label:'班报内容',
                        tagList:[
                            '收款总金额',
                            '收款总笔数',
                            '收款方式名称',
                            '收款方式金额',
                            '退款总金额',
                            '退款总笔数',
                            '合计金额',
                            '合计笔数',
                            '收款明细开始',
                            '收款明细结束',
                            '退款明细开始',
                            '退款明细结束',
                            '合计明细开始',
                            '合计明细结束',
                            '分割行',
                            '换行',
                        ]
                    },
                    // 日报
                    601:{ 
                        name:'ticketHead',
                        label:'日报头',
                        tagList:[
                            
                            '收款台号',
                            '店铺代码',
                            '店铺名称',
                            '打印日期',
                            '打印时间',
                            '分割行',
                            '换行',
                        ]
                    },
                    602:{
                        name:'ticketFoot',
                        label:'日报尾',
                        tagList:[
                            '收款台号',
                            '店铺代码',
                            '店铺名称',
                            '打印日期',
                            '打印时间',
                            '分割行',
                            '换行',
                        ]
                    },
                    603:{
                        name:'ticketDailyContent',
                        label:'日报内容',
                        tagList:[
                            '收款总金额',
                            '收款总笔数',
                            '收款方式名称',
                            '收款方式金额',
                            '退款总金额',
                            '退款总笔数',
                            '合计金额',
                            '合计笔数',
                            '收款明细开始',
                            '收款明细结束',
                            '退款明细开始',
                            '退款明细结束',
                            '合计明细开始',
                            '合计明细结束',
                            '分割行',
                            '换行',
                        ]
                    },
                },
                // ticketSale.tickConditionOut.ticketHead
                tickContent:[
                    'ticketBankCard',
                    'ticketCouponList',
                    'ticketCouponSend',
                    'ticketCouponUse',
                    'ticketDailyContent',
                    'ticketFoot',
                    'ticketGoods',
                    'ticketHead',
                    'ticketMemberInfo',
                    'ticketMoney',
                ]
            };
        },
        props: ["tContainer",'radioValue','ticketSale','ticktype'],
        created() { 
            console.log('ticktype: ',this.ticktype)
        },
        mounted(){
             console.log('this.radioValue',this.radioValue);
        },
        activated(){
            console.log('this.radioValue',this.radioValue);
        },
        computed: { 
            tagFlag(){
                var radioValue = this.radioValue
                var a = (radioValue)<10?'0'+(radioValue):(radioValue);
                return this.ticktype + a
            },
            previewContent(){
                var _this = this;
                console.log(1111111111111);
                
                console.log(this.ticketSale.tickConditionOut);
                if (!this.tickInitInfo[this.tagFlag]||!this.ticketSale.tickConditionOut[this.tickInitInfo[this.tagFlag].name]) {
                    return ''
                }
                console.log(this.tickInitInfo[this.tagFlag].name); 
                console.log(this.ticketSale.tickConditionOut[this.tickInitInfo[this.tagFlag].name]); 
                var html = this.ticketSale.tickConditionOut[this.tickInitInfo[this.tagFlag].name];
                html = html.replace(/\[([^\]]+)\]/g,function($1,$2,$3){

                    return !_this.previewObj[$2]?$2:_this.previewObj[$2]+' '
                })
                return html
            }
        },
        methods: {
            focusFn(){
                

            },

            labelFn(str){
                console.log('str',str)
                this.lastInput = this.$refs.labelContent.$el.children[0];

                if (this.lastInput) {
                    this.lastInput.focus();
                }
                if (typeof document.selection != "undefined") {
                    document.selection.createRange().text = str;
                } else {
                    var space = ''
                    if (str=='换行') {
                        space = '['+str+']\n'
                    }else if (str=='分割行') {
                        space = '\n['+str+']\n'
                        
                    }else{
                        space = '['+str+']'

                    }
                    var con = this.lastInput.value.substr(0, this.lastInput.selectionStart) 
                                +  space
                                + this.lastInput.value.substring(this.lastInput.selectionStart, this.lastInput.value.length) 
                    this.ticketSale.tickConditionOut[this.tickInitInfo[this.tagFlag].name]  = con.replace(/\]\[/g,'] [')

                }
            }
        }
    };
</script>
<style scoped>
.labels-tag .el-tag {
    margin-right: 10px;margin-top: 5px;cursor: pointer;;
}
</style>